<template>
  <div class="options">
    <ul>
      <li>
        <div>
          <i class="iconfont icon-qianbao"></i>
          <p>我的钱包</p>
        </div>
        <i class="iconfont icon-youjiantou"></i>
      </li>
      <router-link to="/address">
        <li>
          <div>
            <i class="iconfont icon-dizhi"></i>
            <p>我的地址</p>
          </div>
          <i class="iconfont icon-youjiantou"></i>
        </li>
      </router-link>
      <li>
        <div>
          <i class="iconfont icon-guanyuwomen"></i>
          <p>客服与帮助</p>
        </div>
        <i class="iconfont icon-youjiantou"></i>
      </li>
    </ul>
  </div>
</template>

<script setup></script>

<style lang="scss" scoped>
.options {
  margin-top: 0.16rem;
  width: 3.39rem;
  height: 2rem;
  ul {
    height: 100%;
    li {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 0.16rem;
      margin: 0.3rem 0;
      div {
        display: flex;
        align-items: center;
        i {
          color: #ed4a47;
          font-size: 0.25rem;
        }
        p {
          font-size: 0.14rem;
          color: #262626;
          margin-left: 0.171rem;
        }
      }
      i {
        color: #c2c4ca;
        font-size: 0.12rem;
      }
    }

    :nth-child(2) div i {
      color: #32c5ff;
    }
    :nth-child(3) div i {
      color: #9013fe;
    }
  }
}
</style>
